<template>
  <el-dialog title="添加测评对象" :visible.sync="isAddProgress" width="80%" :before-close="handleClose" :close-on-click-modal='false'>
    <el-row :gutter="20">
      <el-col :span="5"><el-cascader v-model="city" :props="{value:'id',label:'name',children:'child'}" :options="options" @change="handleChange" size="small"></el-cascader></el-col>
      <el-col :span="5"><el-input v-model="conditions.real_name" placeholder="请输入学校名字" size="small"></el-input></el-col>
      <el-col :span="3"><el-button type="primary" size="small" @click="searchFn">搜索</el-button></el-col>
    </el-row>
    <div class="table">
      <simple-table :tableConfig="tableConfig" :tableData="tableData" @handleSelectionChange="handleSelectionChange"></simple-table>
    </div>
    <span slot="footer" class="dialog-footer">
      <el-button @click="handleClose">取 消</el-button>
      <el-button type="primary" @click="subimFn">确 定</el-button>
    </span>
  </el-dialog>
</template>
<script>
import simpleTable from '@/components/table.vue'
import {APISCHOOLLIST, APIPLACE, APIPLANDISTRIBUTIONPLAN} from '@/common/api.js'
export default {
  props: ['isAddProgress', 'id'],
  components: {
    simpleTable
  },
  data () {
    return {
      options: [],
      city: [],
      conditions: {
        province: '',
        city: '',
        area: '',
        title: ''
      },
      tableConfig: {
        load: false,
        size: 'small', // 表格大小
        style: 'width:100%', // 表格宽度
        align: 'center',
        selection: true,
        border: true,
        config: [
          {name: '序号', type: 'index', width: '60px'},
          {id: 'title', name: '学校名称'},
          {id: 'province_title', name: '省份'},
          {id: 'city_title', name: '城市'},
          {id: 'area_title', name: '区/县'},
          {id: 'amdin_account', name: '超级管理员'},
          {id: 'amdin_name', name: '联系老师'},
          {id: 'tel', name: '联系电话'}
        ]
      },
      tableData: [],
      school_id: ''
    }
  },
  created () {
    this.tableList()
    this.allCity()
  },
  methods: {
    allCity () {
      APIPLACE().then((res) => {
        this.options = res.data
      }).catch((err) => {
        this.$message.error(err.msg)
      })
    },
    tableList () {
      this.conditions.province = this.city[0]
      this.conditions.city = this.city[1]
      this.conditions.area = this.city[2]
      APISCHOOLLIST({
        province: this.conditions.province,
        city: this.conditions.city,
        area: this.conditions.area,
        title: this.conditions.title
      }).then((res) => {
        this.tableData = res.data !== null ? res.data.list : []
      }).catch((err) => {
        this.$message.error(err.msg)
      })
    },
    searchFn () {
      this.tableList()
    },
    handleClose (type) {
      this.$emit('noAddProgress', type)
    },
    handleChange (value) {
      this.conditions.title = ''
    },
    handleSelectionChange (val) {
      var arr = []
      val.val.forEach(element => {
        arr.push(element.id)
      })
      this.school_id = arr.toString()
    },
    subimFn () {
      APIPLANDISTRIBUTIONPLAN({
        plan_id: this.id,
        range_object: this.school_id,
        range_type: 1,
        plan_type: 1
      }).then((res) => {
        this.$message.success(res.msg)
        this.handleClose(1)
      }).catch((err) => {
        this.$message.error(err.msg)
      })
    }
  }
}
</script>
